<?php
/**
 * The main template file.
 *
 * @package WordPress
 * @subpackage Armazem_da_Photografia
 */

get_header(); ?>
<body>


	<!-- Primary Page Layout
	================================================== -->
	<div id="preloader">
		<div id="status">&nbsp;</div>
	</div>	

	
	<div id="home">	
		<div class="backgr"><img class="logo-home" src="<?php bloginfo('template_url'); ?>/images/logo-garamond.png" border="0"/></div>
		<!--<div class="text-home words"> </div>-->
       
				<!--<div id="rotator" class="fadeIn fadeIn-4s fadeIn-Delay-4s">
						 <div><p>BORN INTO CREATIVITY.</p></div>
						 <div><p>FOCUSED ON STRATEGY.</p></div>
						 <div><p>INSPIRED BY TECHNOLOGY.</p></div>
						 <div><p>CONNECTED TO THE PEOPLE.</p></div>
				</div>-->
				<div class="center-home fadeIn fadeIn-4s fadeIn-Delay-4s">
					<ul class="list-social-home">

						<li class="icon-soc-home"><a href="https://www.facebook.com/armazemdaphotografia" target="_blank">&#xf09a;</a></li><!--facebook-->
		
						<li class="icon-soc-home"><a href="http://www.flickr.com/photos/armazemdaphotografia" target="_blank"><img src="<?php bloginfo('template_url'); ?>/images/ico-flickr.png" border="0"/></a></li><!--flickr-->

					</ul>	
				</div>
		<a href="" id="arrow_left"><img src="<?php bloginfo('template_url'); ?>/images/arrow_left.png" alt="Slide Left" /></a>
		<a href="" id="arrow_right"><img src="<?php bloginfo('template_url'); ?>/images/arrow_right.png" alt="Slide Right" /></a>
		
		<div id="maximage">
			<img src="<?php bloginfo('template_url'); ?>/images/slider/1.jpg" alt=""/>
			<img src="<?php bloginfo('template_url'); ?>/images/slider/2.jpg" alt=""/>
			<img src="<?php bloginfo('template_url'); ?>/images/slider/3.jpg" alt=""/>
		</div>	
                <ul class="ca-menu">
                	<li>
                        <a href="#profile" class="scroll">
                            <span class="ca-icon">&#xf015;</span>
                            <div class="ca-content">
                                <h2 class="ca-main">O ESTÚDIO</h2>
                            </div>
                        </a>
                    </li>
                
                    <li>
                        <a href="#works" class="scroll">
                            <span class="ca-icon">&#xf030;</span>
                            <div class="ca-content">
                                <h2 class="ca-main">GALERIAS</h2>
                            </div>
                        </a>
                    </li>
                    
                    <li>
                        <a href="#gallery" class="scroll">
                            <span class="ca-icon"><img src="<?php bloginfo('template_url'); ?>/images/photos-de-familia.png" border="0" class="icon-photofamilia"/></span><!--fotos de familia-->
                            <div class="ca-content">
                                <h2 class="ca-main"></h2>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#news" class="scroll">
                            <span class="ca-icon">&#xf040;</span>
                            <div class="ca-content">
                                <h2 class="ca-main">BLOG</h2>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#contact" class="scroll">
                            <span class="ca-icon">&#xf086;</span>
                            <div class="ca-content">
                                <h2 class="ca-main">CONTATO</h2>
                            </div>
                        </a>
                    </li>
                </ul>		
	</div>
	

	<nav id="navigation">
		<a href="#home" class="scroll" ><img class="logo" alt='logo' src='<?php bloginfo('template_url'); ?>/images/logo-garamond.png' width="" height=""></a>
                    <ul   id="menu">
                        <li>
                            <a href="#home" class="scroll">Início</a>
                        </li>
                        
                        <li>
                            <a href="#profile" class="scroll">O Estúdio</a>
                        </li>
                        
                        <li class="current">
                            <a href="#works" class="scroll">Galerias</a>
                        </li>
                        
                        <li>
                            <a href="#gallery" class="scroll">Photos de Família</a>
                        </li>
                        <li>
                            <a href="#news" class="scroll">Blog</a>
                        </li>
                        <li>
                            <a href="#contact" class="scroll">Contato</a>
                        </li>
                    </ul>
	</nav>
	
    <!-- O ESTUDIO-->
    <div id="profile" class="gradiente-verde">	
		<div class="container">
			<div class="sixteen columns">
				<h1><span>O Estúdio</span></h1>
			</div>
			<div class="sixteen columns">
				<h5>Venha conhecer o nosso estúdio. Será um prazer recebê-lo.</h5>
			</div>
			<div class="clear"></div>
			<div class="sixteen columns">
			<!-- rotativo do estúdio entra aqui -->
            	<?php echo do_shortcode("[metaslider id=4]"); ?>
			</div>
		<div class="clear"></div>	
		</div>	<!--container-->
		
	</div><!--O ESTUDIO FIM-->

	
	<div id="separator2">
		<div class="container">
			<div class="sixteen columns">
				<h5>Momentos para serem lembrados <span>para sempre</span>.</h5>
			</div>
		</div>
	</div>		
    
    
	<div id="works" class="gradiente-amarelo">
		<div class="container">
			<div class="sixteen columns">
				<h1><span>Galerias</span></h1>
			</div>	
			<div class="sixteen columns">
				<h5>Navegue pelos álbuns e conheça nosso trabalho</h5>
			</div>	
		</div>	
		<div id="wrap">
				<div class="wrapper">

					<div class="topbar">
						<span id="close" class="back">&larr;</span>
					</div>
					
					<ul id="tp-grid" class="tp-grid">

						<!-- project1 -->
                        <?php  global $post;
						$myposts = get_posts('numberposts=50&category=4&order=dsc');
						//cat=4 -> Galerias
						foreach($myposts as $post) :
						setup_postdata($post);
						$fields = $cfs->get('fotos');
							foreach ($fields as $field):
						?>
                            <!-- project1 -->
                            <li data-pile="<?php echo $post->post_title ?>">
                                <a href="<?php echo $field['imagem']; ?>" rel="lightbox[<?php echo $post->post_name; ?>]"  title="">
                                    
                                    <?php if($field['legenda']): ?>
                                    <span class="tp-info"><span><?php echo $field['legenda']; ?></span></span>
                                    <?php endif;?>
                                    
                                    <img src="<?php echo $field['imagem']; ?>" alt=""  />
                                </a>
                            </li>
                         <?php endforeach; ?>
                      <?php endforeach; ?>
                        
					</ul>
				</div><!--wrapper-->
		</div>	<!--wrap-->		
	</div>	<!--GALERIA FIM-->
	
	<div id="separator">
		<div class="container">
			<div class="sixteen columns">
				<h5>Fotografia <span>profissional</span> com <span>sensibilidade</span>.</h5>
			</div>
		</div>
	</div>	
	
	
	
	
	<!-- PHOTOS DE FAMILIA -->
	<div id="gallery" class="gradiente-azul">	
		<div class="container">
			<div class="sixteen columns">
				<h1><span><img src="<?php bloginfo('template_url'); ?>/images/Photos-de-FamiliaG.png" border="0"/></span></h1>
			</div>
			<div class="sixteen columns">
				<h5>Registre o amor de família</h5>
			</div>	
		</div>	<!--container-->
	
    
    <div id="wrap">
				<div class="wrapper">

					<div class="topbar">
						<span id="close2" class="back">&larr;</span>
					</div>
					
					<ul id="tp-grid2" class="tp-grid">
						<!-- project1 -->
                            <?php  global $post;
						$myposts = get_posts('numberposts=50&category=5&order=dsc');
						//cat=5 -> Photos de Família
						foreach($myposts as $post) :
						setup_postdata($post);
						$fields = $cfs->get('fotos');
							foreach ($fields as $field):
						?>
                            <!-- project1 -->
                            <li data-pile="<?php echo $post->post_title ?>">
                                <a href="<?php echo $field['imagem']; ?>" rel="lightbox[<?php echo $post->post_name; ?>]"  title="">
                                    
                                    <?php if($field['legenda']): ?>
                                    <span class="tp-info"><span><?php echo $field['legenda']; ?></span></span>
                                    <?php endif;?>
                                    
                                    <img src="<?php echo $field['imagem']; ?>" alt=""  />
                                </a>
                            </li>
                         <?php endforeach; ?>
                      <?php endforeach; ?>
						
					</ul>
				</div>
		</div>	
    
	
	</div><!--gallery photos de familia-->


	<div id="separator3">
		<div class="container">
			<div class="sixteen columns">
				<h5>Inspirações e curiosidades em nosso <span>blog</span>.</h5>
			</div>
		</div>
	</div>	

	

	<div id="news" class="gradiente-vermelho">	
		<div class="container">
			<div class="sixteen columns">
				<h1><span>Blog</span></h1>
			</div>
			<div class="sixteen columns">
				<h5>O que nos inspira?</h5>
			</div>
		</div>
			<div class="main">
				<ul class="cbp_tmtimeline">

                        <?php  global $post;
						$myposts = get_posts('numberposts=3&category=3&order=dsc');
						foreach($myposts as $post) :
						setup_postdata($post);
						?>
                        <li>
                            <time class="cbp_tmtime"><span><?php the_time('d/m/Y') ?></span></time>
                            <div class="cbp_tmlabel">
                                <?php 
								if ( has_post_thumbnail() ) { // check if the post has a Post Thumbnail assigned to it.
								$url_thumb = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID),'large');
								  ?> <img src="<?php bloginfo('template_url'); echo '/timthumb.php?src='.$url_thumb[0].'&w=651&h=150'?>" />
								<?php } 
								?>
                                <h2><?php the_title() ?></h2>
                                <p><?php the_excerpt(); ?></p>
                                <a class="inner-button-news" href="<?php the_permalink();?>">Leia mais</a>
                            </div>
						</li>
                        

                      <?php endforeach; ?>
				</ul>	
			</div>	
	</div>

	
	
	<div id="separator1">
		<div class="container">
			<div class="sixteen columns">
				<h5>Pronto para registrar os seus <span>melhores</span> momentos?</h5>
			</div>
		</div>
	</div>

	
	<div id="contact">
		<div id="map"></div>
		<div class="container">
			<div class="eight columns">
				<form name="ajax-form" id="ajax-form" action="mail-it.php" method="post">
					<label for="name">Nome: * 
						<span class="error" id="err-name">por favor, o seu nome.</span>
					</label>
					<input name="name" id="name" type="text" />
					<label for="email">E-Mail: * 
						<span class="error" id="err-email">por favor, o seu e-mail.</span>
						<span class="error" id="err-emailvld">este e-mail está correto?</span>
					</label>
					<input name="email" id="email" type="text" />
					<label for="message">Mensagem:</label>
					<textarea name="message" id="message"></textarea>
					<button class="send_message" id="send">Enviar</button>
					<div class="error" id="err-form">Ops! Preencha os campos requeridos.</div>
					<div class="error" id="err-timedout">Ops! Falha no envio. Tente mais tarde</div>
					<div class="error" id="err-state"></div>
				</form>
				<div id="ajaxsuccess">Obrigado!</div>	
			</div>
			<div class="eight columns">
				<div class="text-and-icon"><div class="icon-c">&#xf003;</div><h4><a href="mailto:email@server.com"><span>contato@armazemdaphotografia.com</span></a></h4></div>
				<div class="text-and-icon"><div class="icon-c">&#xf10b;</div><h4>(32) 3314-2352</h4></div>
				<div class="text-and-icon"><div class="icon-c">&#xf015;</div><h4>Rua Dr. José Cesário, 46 - Alto dos Passos <br>Juiz de Fora</h4></div>
			</div>	
		</div>	
	</div>		

	<div id="copyright">
		<div class="container">
			<div class="sixteen columns">
				<div class="center">
					<ul class="list-social-contact">
						<!--<li class="icon-soc-contact"><img src="<?php bloginfo('template_url'); ?>/images/soc/1.png" alt="" /></li>-->
						<li class="icon-soc-contact"><a href="https://www.facebook.com/armazemdaphotografia" target="_blank"><img src="<?php bloginfo('template_url'); ?>/images/soc/2.png" alt="" border="0" /></a></li>
						<li class="icon-soc-contact"><a href="http://www.flickr.com/photos/armazemdaphotografia" target="_blank"><img src="<?php bloginfo('template_url'); ?>/images/soc/3.png" alt="" /></a></li>
						<!--<li class="icon-soc-contact"><img src="<?php bloginfo('template_url'); ?>/images/soc/4.png" alt="" /></li>
						<li class="icon-soc-contact"><img src="<?php bloginfo('template_url'); ?>/images/soc/5.png" alt="" /></li>
						<li class="icon-soc-contact"><img src="<?php bloginfo('template_url'); ?>/images/soc/6.png" alt="" /></li>
						<li class="icon-soc-contact"><img src="<?php bloginfo('template_url'); ?>/images/soc/7.png" alt="" /></li>
						<li class="icon-soc-contact"><img src="<?php bloginfo('template_url'); ?>/images/soc/8.png" alt="" /></li>
						<li class="icon-soc-contact"><img src="<?php bloginfo('template_url'); ?>/images/soc/9.png" alt="" /></li>
						<li class="icon-soc-contact"><img src="<?php bloginfo('template_url'); ?>/images/soc/10.png" alt="" /></li>
						<li class="icon-soc-contact"><img src="<?php bloginfo('template_url'); ?>/images/soc/11.png" alt="" /></li>
						<li class="icon-soc-contact"><img src="<?php bloginfo('template_url'); ?>/images/soc/12.png" alt="" /></li>-->
					</ul>	
				</div>
			</div>
			<div class="sixteen columns">
				<div class="border-footer"></div>
			</div>
			<div class="sixteen columns">
				<p>&copy; copyright 2013 Armazém da Photografia</p>
			</div>	
		</div>	
	</div>	
	
<?php get_footer(); ?>